<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>上海建桥学院</title>

	<!-- Global stylesheets -->
	<link href="/static/assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
	<link href="/static/assets/css/minified/bootstrap.min.css" rel="stylesheet" type="text/css">
	<link href="/static/assets/css/minified/core.min.css" rel="stylesheet" type="text/css">
	<link href="/static/assets/css/minified/components.min.css" rel="stylesheet" type="text/css">
	<link href="/static/assets/css/minified/colors.min.css" rel="stylesheet" type="text/css">
	<!-- /global stylesheets -->

	<!-- Core JS files -->
	<script type="text/javascript" src="/static/assets/js/plugins/loaders/pace.min.js"></script>
	<script type="text/javascript" src="/static/assets/js/core/libraries/jquery.min.js"></script>
	<script type="text/javascript" src="/static/assets/js/core/libraries/bootstrap.min.js"></script>
	<script type="text/javascript" src="/static/assets/js/plugins/loaders/blockui.min.js"></script>
	<!-- /core JS files -->


	<!-- /theme JS files -->
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
	<style>
        .error, .validation-valid-label {
            margin-top: 7px;
            margin-bottom: 7px;
            display: block;
            color: #f44336;
            position: relative;
            padding-left: 26px;
        }
	</style>
</head>

<body>

	<!-- Main navbar -->
	<div class="navbar navbar-inverse">
		<div class="navbar-header">
			<a class="navbar-brand" href="index.ftl"><img src="/static/assets/images/logo_light.png" alt=""></a>

			<ul class="nav navbar-nav pull-right visible-xs-block">
				<li><a data-toggle="collapse" data-target="#navbar-mobile"><i class="icon-tree5"></i></a></li>
			</ul>
		</div>

		<div class="navbar-collapse collapse" id="navbar-mobile">
			<ul class="nav navbar-nav navbar-right">
				<li>
					<a href="registration.ftl#">
						<i class="icon-display4"></i> <span class="visible-xs-inline-block position-right"> Go to website</span>
					</a>
				</li>

				<li>
					<a href="registration.ftl#">
						<i class="icon-user-tie"></i> <span class="visible-xs-inline-block position-right"> Contact admin</span>
					</a>
				</li>

				<li class="dropdown">
					<a class="dropdown-toggle" data-toggle="dropdown">
						<i class="icon-cog3"></i>
						<span class="visible-xs-inline-block position-right"> Options</span>
					</a>
				</li>
			</ul>
		</div>
	</div>
	<!-- /main navbar -->


	<!-- Page container -->
	<div class="page-container login-container">

		<!-- Page content -->
		<div class="page-content">

			<!-- Main content -->
			<div class="content-wrapper">

				<!-- Content area -->
				<div class="content">

					<!-- Registration form -->
					<form action="/user/doRegistration" method="post" id="myForm">
						<div class="row">
							<div class="col-lg-6 col-lg-offset-3">
								<div class="panel registration-form">
									<div class="panel-body">

										<div class="text-center">
											<div class="icon-object border-success text-success">
												<i class="icon-plus3"></i></div>
											<h5 class="content-group-lg">注册账号<small class="display-block">都需要填写</small></h5>
										</div>


										<div class="form-group has-feedback">
											<input type="text" class="form-control" id="loginName" name="loginName" minlength="4" placeholder="登陆名称" required />
											<div class="form-control-feedback">
												<i class="icon-user-plus text-muted"></i>
											</div>
										</div>

										<div class="row">
											<div class="col-md-6">
												<div class="form-group has-feedback">
													<input type="text" class="form-control" id="firstName" name="firstName" placeholder="姓名" required>
													<div class="form-control-feedback">
														<i class="icon-user-check text-muted"></i>
													</div>
												</div>
											</div>

											<div class="col-md-6">
												<div class="form-group has-feedback">
													<input type="text" class="form-control" id="secondName" name="secondName"  placeholder="姓" required>
													<div class="form-control-feedback">
														<i class="icon-user-check text-muted"></i>
													</div>
												</div>
											</div>
										</div>

										<div class="row">
											<div class="col-md-6">
												<div class="form-group has-feedback">
													<input type="password" class="form-control" id="password" name="password" placeholder="密码" required>
													<div class="form-control-feedback">
														<i class="icon-user-lock text-muted"></i>
													</div>
												</div>
											</div>

											<div class="col-md-6">
												<div class="form-group has-feedback">
													<input type="password" class="form-control" id="repeatPassword" equalTo="#password"  name="confirm_password" placeholder="重复密码" required>
													<div class="form-control-feedback">
														<i class="icon-user-lock text-muted"></i>
													</div>
												</div>
											</div>
										</div>

										<div class="row">
											<div class="col-md-6">
												<div class="form-group has-feedback">
													<input type="email" class="form-control" id="email" name="email" placeholder="email" required>
													<div class="form-control-feedback">
														<i class="icon-mention text-muted"></i>
													</div>
												</div>
											</div>

											<div class="col-md-6">
												<div class="form-group has-feedback">
													<input type="email" class="form-control" id="repeatEmail" name="confirm_email" placeholder="重复email" required>
													<div class="form-control-feedback">
														<i class="icon-mention text-muted"></i>
													</div>
												</div>
											</div>
										</div>

                                        <input type="hidden"  id="error_msg" value="${error_info!''}" />
										<div class="text-right">
											<button type="button" class="btn btn-link"><i class="icon-arrow-left13 position-left"></i>返回登陆页面</button>
											<button type="button" id="create_account" class="btn bg-teal-400 btn-labeled btn-labeled-right ml-10"><b><i class="icon-plus3"></i></b>创建账号</button>
										</div>
									</div>
								</div>
							</div>
						</div>
					</form>
					<!-- /registration form -->


					<!-- Footer -->
					<#include 'footer.ftl'/>
					<!-- /footer -->

				</div>
				<!-- /content area -->

			</div>
			<!-- /main content -->

		</div>
		<!-- /page content -->

	</div>
	<!-- /page container -->
	<script type="text/javascript">

		$(function(){

            var error_msg = $("#error_msg").val();
            if(error_msg != ''){
                alert(error_msg);
            }

		    $("#create_account").on("click",function(){
                //$("#myForm").validate();
                //console.log();
				var loginName = $("#loginName").val();
                var firstName = $("#firstName").val();
                var secondName = $("#secondName").val();
                var email = $("#email").val();
                var repeatEmail = $("#repeatEmail").val();
                var password = $("#password").val();
                var repeatPassword = $("#repeatPassword").val();

                if(loginName == ''){
					alert("登陆名不能为空！");
					return;
				}
                if(firstName == ''){
                    alert("姓名不能为空！");
                    return;
                }
                if(secondName == ''){
                    alert("姓不能为空！");
                    return;
                }
                if(password == ''){
                    alert("密码不能为空！");
                    return;
                }

				if(password != repeatPassword){
                    alert("两次输入的密码不相同！");
                    return ;

				}

                if(email != repeatEmail){
                    alert("两次输入的Email不相同！");
                    return ;

                }
				$("#myForm").submit();
			});


		});
	</script>
</body>
</html>
